import React from 'react'
import {HashRouter,Switch,Route,Link} from 'react-router-dom'
import Team from './components/Team'
import Student from './components/Student'
import Teacher from './components/Teacher'
import "antd/dist/antd.css";
import {PieChartOutlined,DesktopOutlined, } from '@ant-design/icons';
import { Layout,Menu } from 'antd';
const { Header, Content, Sider } = Layout;

class Home extends React.Component{
    render(){
        return(
          <HashRouter>
            <div>
            <Layout>
                <Header>
                    <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']} onClick={(obj)=>{
                        if(obj.key === '1'){
                            this.props.history.push('/about')
                        }
                    }}>
                        <Menu.Item key="1">About</Menu.Item>
                        <Menu.Item key="2">nav 2</Menu.Item>
                        <Menu.Item key="3">nav 3</Menu.Item>
                    </Menu>
                </Header>
                <Layout>
                    <Sider  width={200} className="site-layout-background">
                        <Menu theme="dark" defaultSelectedKeys={['1']} mode="inline">
                            <Menu.Item key="1" icon={<PieChartOutlined />}>
                                <Link to="/team">团队</Link>
                            </Menu.Item>
                            <Menu.Item key="2" icon={<DesktopOutlined />}>
                                <Link to="/student">学生</Link>
                            </Menu.Item>
                            <Menu.Item key="3" icon={<DesktopOutlined />}>
                                <Link to="/teacher">老师</Link>
                            </Menu.Item>
                        </Menu>
                    </Sider>
                    <Content>
                        <Switch>
                            <Route path="/team" component={Team} />
                            <Route path="/student" component={Student} />
                            <Route path="/teacher" component={Teacher} />
                        </Switch>
                    </Content>
                </Layout>
            </Layout>
            </div>
         </HashRouter>
        )
      }
}
export default Home